@import '../../styles';

.yellowboard::before {
  content: '';
  position: absolute;
  top: 0;
  background: #f9da4a;
  filter: blur(200px);
  width: 100%;
  height: 100%;
  z-index: -1;
}

.yellowboard {
  width: 100%;
  height: 100%;
  display: grid;
  position: relative;
  grid-template-columns: repeat(24, 1fr);
  grid-template-rows: repeat(24, 1fr);
  .yellowboard-item {
    position: relative;
    margin: 10px;
    background: #fff;
    border-radius: 5px;
    .flexCenter();
    .font444();
  }
}

.yellowboard-point-item {
  background: #fdd601;
  margin: 10px;
  border-radius: 5px;
  .flexCenter();
  .font444();
}

.yellowboard-blue {
  background: #1276be;
  .rewardbox();
  .flexCenter();
  .fontfff();
}
.yellowboard-orange {
  background: #ee7c00;
  .rewardbox();
  .flexCenter();
  .fontfff();
}
.yellowboard-green {
  background: #02a338;
  .rewardbox();
  .flexCenter();
  .fontfff();
}
